﻿@using PlatformNetCore.Entity;
@model HomeInfo

<link href="~/js/vendor/swiper/css/swiper-bundle.min.css" rel="stylesheet">
<div class="page-home">
    @if (Model.SinglePageIndex != null)
    {
        @Html.Raw(Model.SinglePageIndex.Content)
    }
    <section class="s6" style="background-image:url(img/home_12.jpg);">
        <div class="container">
            <h3 class="title text38 wow fadeInUp">合作医院</h3>
            <div class="logo-container swiper-container">
                <div class="swiper-wrapper">
                    @foreach (var item in Model.Partners)
                    {
                        <div class="swiper-slide"><img src="/image/319/139/@item.CoverImage" alt="@item.Title"></div>
                    }
                </div>
            </div>
            <div class="swiper-button-prev"></div>
            <div class="swiper-button-next"></div>
        </div>
    </section>
    <section class="s7">
        <div class="container">
            <div class="row">
                @foreach (var item in Model.Videos)
                {
                    <div class="col-md-4">
                        <a class="item wow fadeInUp" href="javascript:void(0);" data-url="@item.VideoPath" data-poster="/image/467/329/@item.CoverImage">
                            <img src="/image/467/329/@item.CoverImage" alt="@item.Title">
                            <div class="play"><img src="/img/play.png" alt=""></div>
                        </a>
                    </div>
                }
            </div>
        </div>
    </section>

    <div class="overly" id="overly">
        <div class="video-container">
            <div class="video-header">
                <div class="video-title" id="video-title">视频播放</div><a class="btnClose" id="btnClose" href="javascript:void(0);"> <i class="iconfont icon-searchclose"></i></a>
            </div>
            <div class="video_wrap" id="youkuplayer">
                <video id="vid" src="" poster="" autoplay controls></video>
            </div>
        </div>
    </div>

    @if (Model.SinglePageJoinUs != null)
    {
        @Html.Raw(Model.SinglePageJoinUs.Content)
    }
</div>
@section scripts{
    <script src="~/js/vendor/swiper/js/swiper-bundle.min.js"></script>
    <script>
        //Make sure that the dom is ready
        var swiper = new Swiper('.logo-container', {
            slidesPerView: 1,
            spaceBetween: 20,
            navigation: {
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },

            autoplay: {
                delay: 3000,
                disableOnInteraction: false,
            },
            breakpoints: {
                640: {
                    slidesPerView: 2, spaceBetween: 10,
                },
                768: {
                    slidesPerView: 3, spaceBetween: 10,
                },
                1024: {
                    slidesPerView: 4, spaceBetween: 20,
                },
            }
        });

        $(function () {
            $("#btnClose").click(function (e) {
                $("#overly").fadeOut();
            });
            $('.s7 .item').click(function () {
                var videoSrc = $(this).attr('data-url');
                var poster = $(this).attr('data-poster');
                $('#overly').fadeIn(200);
                $('.video_wrap video').attr('poster', poster);
                $('.video_wrap video').attr('src', videoSrc);
                $('.video_wrap video')[0].play();
                //$("#videoshow").text(title);

            });
            $('body').addClass('home-body');

        });
    </script>
}
